<style lang="less">
  @import './login.less';
</style>

<template>
  <div class="login">
    <div class="login-con">
      <Card icon="log-in" title="欢迎登录" :bordered="false">
        <div class="form-con">
          <login-form @on-success-valid="handleSubmit"></login-form>
          <div>
            <span @click="gotoLoginForget" class="ls">忘记密码</span>
            <span @click="gotoLoginReg" class="rsl">免费注册</span>
          </div>
          <p class="login-tip"></p>
        </div>
      </Card>
    </div>
  </div>
</template>

<script>
  // import { mapActions } from 'vuex'
  import loginForm from '../../components/login-form/login-form.vue'
  import {UserLogin} from "../../api/data"
  import md5 from 'js-md5';

  export default {
    data() {
      return {
        formLeft: {
          id: '',
          userName: '',
          userPassword: '',
          randomNo: '',
        },
      }
    },
    components: {
      loginForm
    },
    methods: {
      handleSubmit({username, password}) {
        let par = {
          userName: username,
          userPassword: password
        }
        UserLogin(par).then(res => {
          if (res.data.code != 0) {
            this.$Message.error(res.data.msg)
          } else {

            this.$cookies.set("loginUser", {}, 60 * 60 * 8); // 设置cookie中存放的生命周期
            localStorage.setItem('username', username);
            localStorage.setItem('password', password);
            this.formLeft=res.data.data;
            localStorage.setItem('permissionIds', this.formLeft.randomNo);
            this.$router.push('/login').catch(err => err);
            this.$router.go(0);
          }
        })
      },
      gotoLoginReg() {
        this.$router.replace('/register')
      },
      gotoLoginForget() {
        this.$router.replace('/retrieve_password')
      }
    }
  }
</script>

<style>
  .rsl {
    float: right;
    cursor: pointer;
  }

  .ls {
    cursor: pointer;
  }
</style>
